<template>
  <star-horse-dialog :visible = "batchDialogTableVisible" :title = "dialogTitle" is-batch = "true" @merge = "merge"
                     @mergeDraft = "mergeDraft"
                     @reset = "resetForm">

    <el-table
        :data = "batchDataList"
        :row-class-name = "rowClassName"
        @selection-change = "handleDetailSelectionChange"
        border
        fit = "true"
        ref = "tb"
        v-loading = "loading"
    >
      <el-table-column align = "center" type = "selection" width = "30" fixed = "left"/>
      <el-table-column align = "center" label = "序号" prop = "xh" width = "80"></el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "主键"
          min-width = "200px"
          prop = "idUsersinfo"
          required
          sortable v-if = " false ">
        <template #default = "scope">
          <el-input-number clearable placeholder = "请输入主键"
                           v-model = "batchDataList[scope.row.xh-1].idUsersinfo"/>
        </template>
      </el-table-column>

      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "姓名"
          min-width = "200px"
          prop = "name"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入姓名"
                    v-model = "batchDataList[scope.row.xh-1].name"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "用户名"
          min-width = "200px"
          prop = "username"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入用户名"
                    v-model = "batchDataList[scope.row.xh-1].username"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "性别"
          min-width = "200px"
          prop = "sex"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input-number clearable placeholder = "请输入性别"
                           v-model = "batchDataList[scope.row.xh-1].sex"/>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "联系电话"
          min-width = "200px"
          prop = "phone"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入联系电话"
                    v-model = "batchDataList[scope.row.xh-1].phone"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "紧急联系人电话"
          min-width = "200px"
          prop = "bakePhone"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入紧急联系人电话"
                    v-model = "batchDataList[scope.row.xh-1].bakePhone"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "邮箱地址"
          min-width = "200px"
          prop = "email"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入邮箱地址"
                    v-model = "batchDataList[scope.row.xh-1].email"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "通信地址"
          min-width = "200px"
          prop = "address"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入通信地址"
                    v-model = "batchDataList[scope.row.xh-1].address"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "学历"
          min-width = "200px"
          prop = "education"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入学历"
                    v-model = "batchDataList[scope.row.xh-1].education"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "入职时间"
          min-width = "200px"
          prop = "entryDate"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-date-picker clearable placeholder = "请选择入职时间"
                          type = "date"
                          v-model = "batchDataList[scope.row.xh-1].entryDate">
          </el-date-picker>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "离职时间"
          min-width = "200px"
          prop = "leaveDate"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-date-picker clearable placeholder = "请选择离职时间"
                          type = "date"
                          v-model = "batchDataList[scope.row.xh-1].leaveDate">
          </el-date-picker>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "籍贯"
          min-width = "200px"
          prop = "nativePlace"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入籍贯"
                    v-model = "batchDataList[scope.row.xh-1].nativePlace"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "政治面貌"
          min-width = "200px"
          prop = "politicalStatus"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入政治面貌"
                    v-model = "batchDataList[scope.row.xh-1].politicalStatus"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "证件类型"
          min-width = "200px"
          prop = "identityType"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入证件类型"
                    v-model = "batchDataList[scope.row.xh-1].identityType"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "证件编号"
          min-width = "200px"
          prop = "identityNo"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入证件编号"
                    v-model = "batchDataList[scope.row.xh-1].identityNo"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "备注"
          min-width = "200px"
          prop = "remark"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入备注"
                    v-model = "batchDataList[scope.row.xh-1].remark"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "修改人"
          min-width = "200px"
          prop = "updatedBy"
          sortable
          v-if = " false ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入修改人"
                    v-model = "batchDataList[scope.row.xh-1].updatedBy"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "修改日期"
          min-width = "200px"
          prop = "updatedDate"
          sortable
          v-if = " false ">
        <template #default = "scope">
          <el-date-picker clearable placeholder = "请选择修改日期"
                          type = "date"
                          v-model = "batchDataList[scope.row.xh-1].updatedDate">
          </el-date-picker>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "创建人"
          min-width = "200px"
          prop = "createdBy"
          sortable
          v-if = " false ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入创建人"
                    v-model = "batchDataList[scope.row.xh-1].createdBy"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "创建日期"
          min-width = "200px"
          prop = "createdDate"
          sortable
          v-if = " false ">
        <template #default = "scope">
          <el-date-picker clearable placeholder = "请选择创建日期"
                          type = "date"
                          v-model = "batchDataList[scope.row.xh-1].createdDate">
          </el-date-picker>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "是否删除 1 是 0否"
          min-width = "200px"
          prop = "isDel"
          sortable
          v-if = " false ">
        <template #default = "scope">
          <el-input-number clearable placeholder = "请输入是否删除 1 是 0否"
                           v-model = "batchDataList[scope.row.xh-1].isDel"/>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "状态名称"
          min-width = "200px"
          prop = "statusName"
          sortable
          v-if = " false ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入状态名称"
                    v-model = "batchDataList[scope.row.xh-1].statusName"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "状态编码"
          min-width = "200px"
          prop = "statusCode"
          required
          sortable v-if = "true ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入状态编码"
                    v-model = "batchDataList[scope.row.xh-1].statusCode"></el-input>
        </template>
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "系统编号"
          min-width = "200px"
          prop = "dataNo"
          sortable
          v-if = " false ">
        <template #default = "scope">
          <el-input clearable placeholder = "请输入系统编号"
                    v-model = "batchDataList[scope.row.xh-1].dataNo"></el-input>
        </template>
      </el-table-column>
      <el-table-column fixed = "right" label = "操作" min-width = "150px">
        <template #header = "scope">
          <span>操作</span>&nbsp;&nbsp;
          <el-button @click = "handleAddDetails(scope.row,1)" link size = "mini" type = "primary">
            <el-tooltip content = "添加一行">
              <user-icon icon = "plus" style = "vertical-align: middle;color:#409EFF;"/>
            </el-tooltip>
          </el-button>
        </template>
        <template #default = "scope">
          <el-button v-if = "scope.row.xh==ruleForm.batchDataList.length" @click = "handleAddDetails(scope.row,1)" link
                     size = "mini" type = "primary">
            <el-tooltip content = "添加一行">添加</el-tooltip>
          </el-button>
          <el-button @click = "handleAddDetails(scope.row,2)" link size = "mini" type = "danger">
            <el-tooltip content = "删除当前行">删除</el-tooltip>
          </el-button>
        </template>
      </el-table-column>
    </el-table>

  </star-horse-dialog>

  <star-horse-dialog :visible = "dialogTableVisible" :title = "dialogTitle" @merge = "merge" @mergeDraft = "mergeDraft"
                     @reset = "resetForm">
    <el-form :model = "ruleForm" :rules = "rules" class = "demo-ruleForm" label-position = "labelPosition"
             label-width = "120px"
             ref = "ruleForm">
      <el-form-item label = "主键" prop = "idUsersinfo" v-if = "false">
        <el-input clearable placeholder = "请输入主键"
                  v-model = "ruleForm.idUsersinfo"></el-input>
      </el-form-item>

      <el-form-item label = "主键" prop = "idUserAudit"
                    required v-if = "false">
        <el-input-number clearable placeholder = "请输入主键"
                         v-model = "ruleForm.idUserAudit"/>
      </el-form-item>
      <el-row>
        <el-col :span = "18">
          <el-row>
            <el-col :span = "24">
              <el-form-item label = "所属部门" prop = "deptList"
                            required v-if = "!false">
                <el-select clearable
                           collapse-tags
                           filterable
                           multiple
                           placeholder = "请选择所属部门"
                           v-model = "ruleForm.deptList">
                  <el-option
                      :key = "sitem.idDepartment"
                      :label = "sitem.deptName"
                      :value = "sitem.idDepartment"
                      v-for = "sitem in departList"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span = "24">
              <el-form-item label = "角色信息" prop = "rolesList"
                            required v-if = "!false">
                <el-select
                    clearable
                    collapse-tags
                    filterable
                    multiple
                    placeholder = "请选择角色"
                    v-model = "ruleForm.rolesList">
                  <el-option
                      :key = "sitem.idRolesinfo"
                      :label = "sitem.roleName"
                      :value = "sitem.idRolesinfo"
                      v-for = "sitem in rolesList"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span = "24">
              <el-form-item label = "姓名" prop = "name"
                            required v-if = "!false">
                <el-input clearable placeholder = "请输入姓名"
                          v-model = "ruleForm.name"></el-input>
              </el-form-item>
            </el-col>
          </el-row>

        </el-col>
        <el-col :span = "6">
          <el-form-item label = "证件照" prop = "file">
            <el-upload
                :auto-upload = "false"
                :before-upload = "beforeUpload"
                :data = "ruleForm"
                :on-change = "imageOne"
                :on-error = "uploadError"
                :on-preview = "handlePictureCardPreview"
                :on-remove = "removeOne"
                :on-success = "uploadSuccess"
                accept = "image/*"
                action = "/system-config/system/usersinfoEntity/mergeWithFile"
                :headers = "uploadHeaders"
                class = "upload-demo"
                list-type = "picture-card"
                multiple = "false"
                name = "file"
                ref = "userUpload"
            >
              <user-icon icon = "user-tie"
                         style = "vertical-align: middle;font-size: 80px;color: #3a8ee6"/>
            </el-upload>
            <el-dialog v-model = "dialogVisible">
              <img :src = "dialogImageUrl" alt = "" width = "100%"/>
            </el-dialog>
          </el-form-item>

        </el-col>
      </el-row>
      <el-row>
        <el-col :span = "12">
          <el-form-item label = "工号" prop = "employeeNo"
                        required v-if = "!false">
            <el-input clearable placeholder = "请输入员工编号"
                      v-model = "ruleForm.employeeNo"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span = "12">
          <el-form-item label = "用户名" prop = "username"
                        required v-if = "!false">
            <el-input clearable placeholder = "请输入用户名"
                      v-model = "ruleForm.username"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span = "12">
          <el-form-item label = "性别" prop = "sex"
                        required v-if = "!false">
            <el-radio-group v-model = "ruleForm.sex">
              <el-radio label = "1">男</el-radio>
              <el-radio label = "2">女</el-radio>
              <el-radio label = "3">保密</el-radio>
            </el-radio-group>

          </el-form-item>
        </el-col>
        <!--<el-col :span="12">
          <el-form-item label="学历" prop="education"
                        required v-if="!false">
            <el-select
                clearable
                collapse-tags
                filterable
                placeholder="请选择学历"
                v-model="ruleForm.education">
              <el-option
                  :key="sitem.statusCode"
                  :label="sitem.statusName"
                  :value="sitem.statusCode"
                  v-for="sitem in educations"
              >
              </el-option>
            </el-select>

          </el-form-item>
        </el-col>
      </el-row>
      <el-row>-->
        <el-col :span = "12">
          <el-form-item label = "联系电话" prop = "phone"
                        required v-if = "!false">
            <el-input clearable placeholder = "请输入联系电话"
                      v-model = "ruleForm.phone"></el-input>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="12">
           <el-form-item label="紧急联系人电话" prop="bakePhone"
                         required v-if="!false">
             <el-input clearable placeholder="请输入紧急联系人电话"
                       v-model="ruleForm.bakePhone"></el-input>
           </el-form-item>
         </el-col>-->
      </el-row>

      <el-row>
        <el-col :span = "12">
          <el-form-item label = "邮箱地址" prop = "email"
                        required v-if = "!false">
            <el-input clearable placeholder = "请输入邮箱地址"
                      v-model = "ruleForm.email"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span = "12">
          <el-form-item label = "通信地址" prop = "address"
                        required v-if = "!false">
            <el-input clearable placeholder = "请输入通信地址"
                      v-model = "ruleForm.address"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <!--  <el-row>
          <el-col :span="12">
            <el-form-item label="入职时间" prop="entryDate"
                          required v-if="!false">
              <el-date-picker clearable placeholder="请选择入职时间" type="date"
                              v-model="ruleForm.entryDate">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="离职时间" prop="leaveDate"
                          v-if="!false">
              <el-date-picker clearable placeholder="请选择离职时间" type="date"
                              v-model="ruleForm.leaveDate">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>-->
      <!-- <el-row>
         <el-col :span="12">
           <el-form-item label="籍贯" prop="nativePlace"
                         required v-if="!false">
             <el-cascader
                 :options="areaList"
                 :props="props"
                 @change="handleChange"
                 clearable
                 filterable
                 placeholder="请选择籍贯"
                 v-model="ruleForm.nativePlace"
             ></el-cascader>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="政治面貌" prop="politicalStatus"
                         required v-if="!false">
             <el-select clearable
                        filterable
                        placeholder="请选择状政治面貌"
                        v-model="ruleForm.politicalStatus">
               <el-option
                   :key="sitem.statusCode"
                   :label="sitem.statusName"
                   :value="sitem.statusCode"
                   v-for="sitem in politicals"
               >
               </el-option>
             </el-select>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="12">
           <el-form-item label="证件类型" prop="identityType"
                         required v-if="!false">
             <el-select clearable
                        filterable
                        placeholder="请选择证件类型"
                        v-model="ruleForm.identityType">
               <el-option
                   :key="sitem.statusCode"
                   :label="sitem.statusName"
                   :value="sitem.statusCode"
                   v-for="sitem in credentials"
               >
               </el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="证件编号" prop="identityNo"
                         required v-if="!false">
             <el-input clearable placeholder="请输入证件编号"
                       v-model="ruleForm.identityNo"></el-input>
           </el-form-item>
         </el-col>
       </el-row>-->
      <el-row>
        <el-col :span = "12">
          <el-form-item label = "状态" prop = "statusCode"
                        v-if = "!false">
            <el-select clearable
                       filterable
                       placeholder = "请选择状态"
                       v-model = "ruleForm.statusCode">
              <el-option
                  :key = "sitem.statusCode"
                  :label = "sitem.statusName"
                  :value = "sitem.statusCode"
                  v-for = "sitem in selectData"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

      </el-row>
      <el-row>
        <el-col :span = "24">
          <el-form-item label = "备注" prop = "remark"
                        v-if = "!false">
            <el-input clearable maxlength = "1000"
                      placeholder = "请输入备注" show-word-limit type = "textarea"
                      v-model = "ruleForm.remark"></el-input>
          </el-form-item>
        </el-col>
      </el-row>


      <el-form-item label = "修改人" prop = "updatedBy"
                    v-if = "!true">
        <el-input clearable placeholder = "请输入修改人"
                  v-model = "ruleForm.updatedBy"></el-input>
      </el-form-item>

      <el-form-item label = "修改日期" prop = "updatedDate"
                    v-if = "!true">
        <el-date-picker clearable placeholder = "请选择修改日期" type = "date"
                        v-model = "ruleForm.updatedDate">
        </el-date-picker>
      </el-form-item>

      <el-form-item label = "创建人" prop = "createdBy"
                    v-if = "!true">
        <el-input clearable placeholder = "请输入创建人"
                  v-model = "ruleForm.createdBy"></el-input>
      </el-form-item>

      <el-form-item label = "创建日期" prop = "createdDate"
                    v-if = "!true">
        <el-date-picker clearable placeholder = "请选择创建日期" type = "date"
                        v-model = "ruleForm.createdDate">
        </el-date-picker>
      </el-form-item>

      <el-form-item label = "是否删除 1 是 0否" prop = "isDel"
                    v-if = "!true">
        <el-input-number clearable placeholder = "请输入是否删除 1 是 0否"
                         v-model = "ruleForm.isDel"/>
      </el-form-item>

      <el-form-item label = "状态名称" prop = "statusName"
                    v-if = "!true">
        <el-input clearable placeholder = "请输入状态名称"
                  v-model = "ruleForm.statusName"></el-input>
      </el-form-item>


      <el-form-item label = "系统编号" prop = "dataNo"
                    v-if = "!true">
        <el-input clearable placeholder = "请输入系统编号"
                  v-model = "ruleForm.dataNo"></el-input>
      </el-form-item>


    </el-form>
  </star-horse-dialog>
  <star-horse-dialog :visible = "viewVisible" :title = "'查看数据'" :is-view = "true">
    <div class = "item">
      <label>姓名:</label>
      <div class = "content">{{ ruleForm.name }}</div>
    </div>
    <div class = "item">
      <label>用户名:</label>
      <div class = "content">{{ ruleForm.username }}</div>
    </div>
    <div class = "item">
      <label>性别:</label>
      <div class = "content">{{ ruleForm.sex == 1 ? "男" : ruleForm.sex == 2 ? "女" : "保密" }}</div>
    </div>
    <div class = "item">
      <label>联系电话:</label>
      <div class = "content">{{ ruleForm.phone }}</div>
    </div>
    <div class = "item">
      <label>邮箱地址:</label>
      <div class = "content">{{ ruleForm.email }}</div>
    </div>
    <div class = "item">
      <label>通信地址:</label>
      <div class = "content">{{ ruleForm.address }}</div>
    </div>
    <div class = "item">
      <label>备注:</label>
      <div class = "content">{{ ruleForm.remark }}</div>
    </div>
    <div class = "item">
      <label>证件照:</label>
      <div class = "content">
        <el-image :src = "'/dbsearch'+ruleForm.imagePath" lazy = "true"></el-image>
      </div>
    </div>
    <div class = "item">
      <label>创建人:</label>
      <div class = "content">{{ ruleForm.createdBy }}</div>
    </div>
    <div class = "item">
      <label>修改日期:</label>
      <div class = "content">{{ createDate(ruleForm.updatedDate) }}</div>
    </div>
    <div class = "item">
      <label>状态:</label>
      <div class = "content">{{ ruleForm.statusName }}</div>
    </div>

  </star-horse-dialog>
  <star-horse-dialog :visible = "dialogPwdVisible" :is-show-reset = "false" :is-show-save = "false"
                     :title = "dialogTitle"
                     @merge = "pwdMerge"
                     @reset = "resetForm">
    <el-form :model = "ruleForm" :rules = "rules" class = "demo-ruleForm" label-position = "labelPosition"
             label-width = "120px"
             ref = "ruleForm">
      <el-form-item label = "主键" prop = "idUsersinfo" v-if = "false">
        <el-input clearable placeholder = "请输入主键"
                  v-model = "ruleForm.idUsersinfo"></el-input>
      </el-form-item>

      <el-form-item label = "主键" prop = "idUserAudit"
                    required v-if = "false">
        <el-input-number clearable placeholder = "请输入主键"
                         v-model = "ruleForm.idUserAudit"/>
      </el-form-item>

      <el-row>
        <el-col :span = "12">
          <el-form-item label = "工号" prop = "employeeNo"
                        required v-if = "!false">
            {{ ruleForm.employeeNo }}
          </el-form-item>
        </el-col>
        <el-col :span = "12">
          <el-form-item label = "用户名" prop = "username"
                        required v-if = "!false">
            {{ ruleForm.username }}
          </el-form-item>
        </el-col>
      </el-row>

      <el-form-item label = "密码" prop = "password" required
                    v-if = "!false">
        <el-input clearable placeholder = "请输入密码" type = "password"
                  v-model = "ruleForm.password"></el-input>
      </el-form-item>
      <el-form-item label = "确认密码" prop = "rePassword" required v-if = "!false">
        <el-input clearable placeholder = "请输入确认" type = "password"
                  v-model = "ruleForm.rePassword"></el-input>
      </el-form-item>

    </el-form>
  </star-horse-dialog>

  <!--查询区域-->
  <el-card title = "数据列表" class = "inner_content">
    <el-form class = "search_area" size = "default">
      <el-form-item label = "姓名">
        <el-input placeholder = "请输入姓名" v-model = "searchForm.name"/>
      </el-form-item>
      <el-form-item label = "用户名">
        <el-input placeholder = "请输入用户名" v-model = "searchForm.userName"/>
      </el-form-item>
      <el-form-item label = "添加时间">
        <el-date-picker
            end-placeholder = "结束日期" placeholder = "请选择添加时间"
            range-separator = "到"
            start-placeholder = "开始日期"
            type = "daterange"
            v-model = "searchForm.createdDate"
        />
      </el-form-item>
      <el-form-item label = "     ">
        <el-button @click = "dataSearch" link type = "primary">
          <user-icon icon = "search"/>
          <span style = "vertical-align: middle;"> 查询 </span>
        </el-button>
        <el-button @click = "dataSearch(1)" link small>
          <span style = "vertical-align: middle;"> 重置 </span>
        </el-button>
      </el-form-item>
    </el-form>
    <el-divider/>
    <star-horse-button-list
        :permission = "permission"
        :upload-url = "uploadUrl"
        @upload = "upload"
        @uploadProcess = "uploadProcess"
        @uploadError = "uploadError"
        @uploadSuccess = "uploadProcess"
        @btnOperation = "btnOperation"
    />


    <el-table
        :data = "dataList"
        :row-key = "getRowIdentity"
        @row-dblclick = "editData"
        @selection-change = "handleSelectionChange"
        border
        class = "data_table"
        fit = "true"
        highlight-current-row = "true"
        id = "usersinfoPo"
        ref = "multipleTable"
        stripe = "true">
      <el-table-column fixed width = "1"/>
      <el-table-column
          :reserve-selection = "true"
          fixed = "left"
          align = "center"
          type = "selection"
      />
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "主键"
          min-width = "200px"
          prop = "idUsersinfo"
          sortable
          v-if = " false ">
      </el-table-column>

      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "姓名"
          min-width = "200px"
          prop = "name"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "用户名"
          min-width = "200px"
          prop = "username"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "性别"
          min-width = "200px"
          prop = "sex"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "联系电话"
          min-width = "200px"
          prop = "phone"
          sortable
          v-if = "true ">
      </el-table-column>
      <!-- <el-table-column
           :formatter="dataFormat"
           :show-overflow-tooltip="true"
           label="紧急联系人电话"
           min-width="200px"
           prop="bakePhone"
           sortable
           v-if="true ">
       </el-table-column>-->
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "邮箱地址"
          min-width = "200px"
          prop = "email"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "通信地址"
          min-width = "200px"
          prop = "address"
          sortable
          v-if = "true ">
      </el-table-column>
      <!-- <el-table-column
           :formatter="dataFormat"
           :show-overflow-tooltip="true"
           label="学历"
           min-width="200px"
           prop="education"
           sortable
           v-if="true ">
       </el-table-column>-->
      <!-- <el-table-column
           :formatter="dataFormat"
           :show-overflow-tooltip="true"
           label="入职时间"
           min-width="200px"
           prop="entryDate"
           sortable
           v-if="true ">
       </el-table-column>
       <el-table-column
           :formatter="dataFormat"
           :show-overflow-tooltip="true"
           label="离职时间"
           min-width="200px"
           prop="leaveDate"
           sortable
           v-if="true ">
       </el-table-column>-->
      <!--<el-table-column
          :formatter="dataFormat"
          :show-overflow-tooltip="true"
          label="籍贯"
          min-width="200px"
          prop="nativePlace"
          sortable
          v-if="true ">
      </el-table-column>
      <el-table-column
          :formatter="dataFormat"
          :show-overflow-tooltip="true"
          label="政治面貌"
          min-width="200px"
          prop="politicalStatus"
          sortable
          v-if="true ">
      </el-table-column>
      <el-table-column
          :formatter="dataFormat"
          :show-overflow-tooltip="true"
          label="证件类型"
          min-width="200px"
          prop="identityType"
          sortable
          v-if="true ">
      </el-table-column>
      <el-table-column
          :formatter="dataFormat"
          :show-overflow-tooltip="true"
          label="证件编号"
          min-width="200px"
          prop="identityNo"
          sortable
          v-if="true ">
      </el-table-column>-->
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "所属部门"
          min-width = "200px"
          prop = "deptList"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "角色"
          min-width = "200px"
          prop = "rolesList"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "修改人"
          min-width = "200px"
          prop = "updatedBy"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "修改日期"
          min-width = "200px"
          prop = "updatedDate"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "创建人"
          min-width = "200px"
          prop = "createdBy"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "创建日期"
          min-width = "200px"
          prop = "createdDate"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "是否删除 1 是 0否"
          min-width = "200px"
          prop = "isDel"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "状态"
          min-width = "200px"
          prop = "statusName"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "状态编码"
          min-width = "200px"
          prop = "statusCode"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "系统编号"
          min-width = "200px"
          prop = "dataNo"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column fixed = "right" label = "操作" min-width = "250px">
        <template #default = "scope">
          <el-button v-if = "permission.edit" @click = "editById(scope.row[primaryKey])" link title = ""
                     type = "primary">
            <el-tooltip content = "编辑">编辑</el-tooltip>
          </el-button>
          <el-button v-if = "permission.edit" @click = "editPwd(scope.row[primaryKey])" link title = ""
                     type = "primary">
            <el-tooltip content = "修改密码">修改密码</el-tooltip>
          </el-button>
          <el-button v-if = "permission.view" @click = "viewById(scope.row[primaryKey])" link title = ""
                     type = "primary">
            <el-tooltip content = "查看">查看</el-tooltip>
          </el-button>
          <el-button v-if = "permission.delete" @click = "deleteById(scope.row[primaryKey])" link title = ""
                     type = "danger">
            <el-tooltip content = "删除">删除</el-tooltip>
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-divider/>
    <el-pagination
        :total = "totalData"
        @current-change = "pageChangeClick"
        @size-change = "pageSizeClick"
        layout = "total, sizes, prev, pager, next, jumper"
        v-model:currentPage = "currentPage"
        v-model:page-size = "pageSize"
        v-model:pageCount = "totalPage"/>

  </el-card>
</template>
<style>

</style>
<script>
import {error} from "@/utils/message";
import {loadDepartments, loadRoleDatas, loadSelectDatas, postRequest, pwdMerge} from "../../api/star_horse"


import {common} from "@/api/common";
import {ref} from "vue";

export default {
  name: "UsersinfoEntity",
  mixins: [common],
  setup() {

  },
  data() {
    const loadByPageUrl = ref("/system-config/system/usersinfoEntity/pageList");
    let mergeUrl = ref("/system-config/system/usersinfoEntity/merge");
    let mergeDraftUrl = ref("/system-config/system/usersinfoEntity/mergeDraft");
    let batchMergeUrl = ref("/system-config/system/usersinfoEntity/mergeBatch");
    let batchMergeDraftUrl = ref("/system-config/system/usersinfoEntity/mergeBatchDraft");
    let loadByIdUrl = ref("/system-config/system/usersinfoEntity/getById");
    let deleteUrl = ref("/system-config/system/usersinfoEntity/batchDeleteById");
    let exportAllUrl = ref("/system-config/system/usersinfoEntity/exportData");
    let downloadTemplateUrl = ref("/system-config/system/usersinfoEntity/downloadTemplate");
    //{userName}/{newPwd}
    let pwdUrl = ref("/system-config/system/usersAuditEntity/refreshInvalidPassword/");
    const uploadUrl = "/system-config/system/usersinfoEntity/importData";
    let primaryKey = "idUsersinfo";
    return {
      uploadUrl,
      loadByPageUrl,
      mergeUrl,
      mergeDraftUrl,
      batchMergeUrl,
      batchMergeDraftUrl,
      loadByIdUrl,
      deleteUrl,
      exportAllUrl,
      downloadTemplateUrl,
      pwdUrl,
      primaryKey,
      dialogPwdVisible: false,
      rules: {
        deptList: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        rolesList: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        name: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        employeeNo: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        username: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        sex: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        phone: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        email: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        address: [{required: true, message: "必选项不能为空", trigger: "blur"}],
      }
    }
  },
  methods: {
    //修改密码方法
    pwdMerge: function () {
      let that = this;
      pwdMerge(that);
      /* that.$refs.ruleForm.validate((valid) => {
         if (!valid) {
           return;
         }
         let pwd = that.ruleForm.password;
         let rePwd = that.ruleForm.rePassword;
         if (!trim(pwd)) {
           warning("不能设置空格密码");
           return;
         }
         if (pwd.length < 6 || pwd.length > 15) {
           warning("请设置长度为6到15的密码");
           return;
         }
         if (pwd !== rePwd) {
           warning("两次密码不一致，请重新录入");
           return;
         }
         postRequest(that.pwdUrl + that.ruleForm.username + "/" + pwd, {}).then(res => {
           let redata = res.data;
           success(redata.cnMessage);
           that.dialogPwdVisible=!that.dialogPwdVisible;
         });
       });*/
    },
    /**
     * 初始化数据
     */
    init: function () {
      this.dataList = [];
      this.selectData = [];
      this.loadPermissionResources();
      this.loadSelectData("sys_usersinfo");
      this.loadSelectData("education");
      this.loadSelectData("political");
      this.loadSelectData("credentials");
      this.loadDepartData();
      this.loadRolesData();
      this.loadByPage(this.currentPage, this.pageSize);

    },
    loadRolesData() {
      let that = this;
      let query = [];
      loadRoleDatas(query).then(res => {
        that.rolesList = res;
      }).catch(err => {
        error(err);
      });
    },
    loadDepartData() {
      let query = [], that = this;
      loadDepartments(query).then(res => {
        that.departList = res;
      }).catch(err => {
        error(err);
      });

    },
    editPwd(uid) {
      this.ruleForm = {};
      this.dialogTitle = "修改密码";
      this.loadById(uid, 3);
    },
    /**
     * 状态码数据
     */
    loadSelectData(type) {
      let that = this;
      let query = [];
      query.push({
        "propertyName": "statusType",
        "value": type
      })
      loadSelectDatas(query).then(res => {
        if (type == "education") {
          that.educations = res;
        } else if (type == "political") {
          that.politicals = res;
        } else if (type == "credentials") {
          that.credentials = res;
        } else {
          that.selectData = res;
        }

      }).catch(err => {
        error(err);
      });
    },

    parseSearchData: function () {
      let data = this.searchForm;
      let arr = [];
      if (data.name) {
        arr.push({
          propertyName: "name",
          value: data.name,
          operation: "lk"
        });
      }
      if (data.userName) {
        arr.push({
          propertyName: "username",
          value: data.userName,
          operation: "lk"
        });
      }
      if (data.createdDate) {
        arr.push({
          propertyName: "createdDate",
          value: data.createdDate,
          operation: "bt"
        });
      }
      return arr;
    },
    dataFormat(row, column, cellValue, index) {
      cellValue = this.commonDataFormat(row, column, cellValue, index);
      let names = [];
      if (column.property == "rolesList") {
        row.rolesList.forEach(item => names.push(item.roleName));
        return names.toLocaleString();
      }
      if (column.property == "deptList") {
        row.deptList.forEach(item => names.push(item.deptName));
        return names.toLocaleString();
      }
      if (column.property == "sex") {
        return cellValue == 1 ? "男" : cellValue == 2 ? "女" : "保密";
      }
      return cellValue;
    },

    /**
     * 加载区域信息
     */
    loadAreaList() {
      let that = this;
      postRequest("/system-config/system/areainfoEntity/loadThreeGradeAreas", {}).then(res => {
        that.areaList = res.data.data;
      }).catch(err => error(err));
    }
  },
  created() {
    this.init();
    this.loadAreaList();
  }
}
</script>